const path = require('path');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
// 自己写的CopyFile插件
// const CopyFile = require('../webpackPlugins/CopyFile')

// This Webpack plugin allows you to copy, archive (.zip/.tar/.tar.gz), move, delete files and directories before and after builds
// 文件操作插件
const FileManagerPlugin = require('filemanager-webpack-plugin');

const P = (...args) => path.resolve(__dirname, '../', ...args)

module.exports = {
    entry: P('./src/main.js'),
    output: {
        clean: true,
        filename: 'js/[name].[contenthash].js',
        path: P('dist'),
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader'
                ]
            },
            {
                test: /\.s[ac]ss$/i,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    'sass-loader',
                ],
            },
            {
                test: /\.vue$/i,
                use: ['vue-loader'],
            },
            {
                test: /\.(png|jpe?g|gif|svg)$/,
                type: 'asset/resource',
                generator: {
                    filename: 'image/[contenthash][ext]',
                },
            },
            {
                test: /\.(ttf|eot|woff2?)$/,
                type: 'asset/resource',
                generator: {
                    filename: 'font/[contenthash][ext]',
                },
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader',
                options: {
                    presets: [["@babel/preset-env", { "modules": false }]],
                    plugins: [
                        [
                            "component",
                            {
                                "libraryName": "element-ui",
                                "styleLibraryName": "theme-chalk"
                            }
                        ]
                    ]
                }
            }
        ],
    },
    plugins: [
        // 自己写的CopyFile插件
        // new CopyFile({
        //     done: { from: P('public', 'readme.txt'), to: P('dist', 'readme.txt') },
        // }),

        new FileManagerPlugin({
            events: {
                onEnd: {
                    copy: [
                        { source: P('public', 'readme.txt'), destination: P('dist', 'readme.txt') },
                    ],
                }
            }
        }),
        new MiniCssExtractPlugin({
            filename: 'css/[name].css'
        }),
        new VueLoaderPlugin(),
        new HtmlWebpackPlugin({
            template: P('public', 'index.html')
        }),
    ],
    resolve: {
        alias: {
            '@': P('src'),
        },
    },
    performance: {
        hints: false,
    },
};